.lyc-user-layout {
  position: absolute;
  background: #eee;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99;

  .user-layout-panel {
    .user-layout {
      width: 100%;
      margin: 0 auto;
      padding: 0 .2rem;
      position: relative;
      box-sizing: border-box;
      display: flex;
      justify-content: center;

      .mi-logo {

        .header-logoBox {
          padding: .4rem 0 .22rem;
          text-align: center;

          .custom-logo {
            width: .49rem;
            height: .48rem;
            margin: 0 auto .22rem;
            position: relative;

            img {
              position: absolute;
              top: 0;
              left: 0;
              width: 100%;
              height: 100%;
            }
          }

          .header-tit {
            font-size: .2rem;
            color: #424242;
            font-weight: normal;
          }
        }

        .user-input {
          width: 2.8rem;
          height: .85rem;
          border-radius: .03rem;
          overflow: hidden;

          ul {
            width: 100%;
            position: relative;

            li {
              height: .41rem;
              position: relative;

              input {
                position: absolute;
                width: 100%;
                height: .40rem;
                color: #333;
                font-size: .16rem;
                border: none;
                outline: none;
                text-indent: .1rem;
              }

              &:nth-child(1) {
                border-radius: .1rem .1rem 0 0;
                border-bottom: .01rem solid #F3F3F3;
              }

              &:nth-child(2) {
                border-radius: 0 0 .1rem .1rem;
              }
            }

            i {
              position: absolute;
              right: 0.1rem;
              bottom: .05rem;
              font-size: .2rem;
            }
          }
        }

        .login-dialog {
          height: .2rem;
          margin-bottom: .05rem;
          line-height: .2rem;
          color: #f56700;
          padding-top: .14rem;
          display: none;
          flex-direction: row;
          align-items: center;

          .login-logo {
            height: .14rem;
            width: .14rem;
            border-radius: 50%;
            color: #ffffff;
            background: #f56700;
            font-size: .08rem;
            text-align: center;
            line-height: .14rem;
          }

          .login-tit {
            height: .28rem;
            width: 80%;
            font-size: .14rem;
            padding-left: .1rem;
            line-height: .28rem;
          }
        }

        .login_phone {
          width: 2.8rem;
          padding-top: .24rem;
          //margin-bottom: .1rem;

          .btn_login {
            background: #33b4ff;
            width: 100%;
            padding: .1rem 0;
            display: block;
            text-align: center;
            font-size: .16rem;
            color: #ffffff;
            cursor: pointer;
            border-radius: .2rem;
            border: .01rem solid rgba(186, 186, 186, .3);
            overflow: hidden;
            outline: none;
          }
        }

        .others_logo {
          width: 2.8rem;

          .phone_msg_log {

            a {
              background: #ffffff;
              margin-top: .15rem;
              border: .01rem solid #ddd;
              color: #333;
              width: 100%;
              display: block;
              padding: .1rem 0;
              margin-bottom: .14rem;
              text-align: center;
              font-size: .16rem;
              cursor: pointer;
              border-radius: .2rem;
              overflow: hidden;
            }
          }

          .others-tit {
            position: relative;
            width: 2.8rem;
            height: .4rem;
            border-bottom: .01rem dashed #ccc;

            span {
              position: absolute;
              display: block;
              font-size: .14rem;
              color: #b0b0b0;
              left: 1rem;
              top: .3rem;
            }
          }

          .others-link {
            padding-top: .25rem;
            text-align: center;
            width: 2.8rem;
            height: .5rem;

            i {
              width: .45rem;
              height: .45rem;
              margin: 0 .1rem;
              font-style: normal;
              display: inline-block;
              border-radius: 50%;
              font-size: .44rem;
              vertical-align: top;

              &:nth-child(1) {
                font-size: .5rem;
                color: rgb(2, 136, 209);
              }
              &:nth-child(2) {
                color: rgb(211, 47, 47);
              }
              &:nth-child(3) {
                color: rgb(0, 170, 238);
              }
            }
          }

          .n-links-area {
            padding: .4rem 0 .1rem;
            text-align: center;
            color: #e0e0e0;
            width: 100%;
            height: 0;

            a {
              vertical-align: top;
              padding: 0 .09rem;
              font-size: .14rem;
              display: inline-block;
              color: #757575;
            }

            span {
              border: 0;
              margin: 0;
              padding: 0;
            }
          }

          .language {
            padding-top: .6rem;
            display: flex;
            justify-content: center;
            color: #757575;
            text-align: center;
            font-size: .14rem;

            span {
              margin-right: .05rem;
              margin-left: .05rem;

              &:nth-child(1) {
                color: #333;
              }
            }
          }
        }
      }
    }
  }
}
